/* 通用样式表 px单位版本 PC环境酌情使用 */

/* 通用变量 */
$s:1px; $xs:2px; $m:3px; $sm: 4px; $l:5px; $sl:6px; $ml:7px; $xl:8px; $sd:9px; $md: 10px;
$sg:11px; $lg: 12px; $lgs: 13px; $lgm: 14px; $lgx: 15px;

$color-info:#2080f0; $color-error:#d03050; $color-warning:#f0a020; $color-success: #18a058; 
$color-gray: #999; $color-disabled: #dbd2d2; $color-default: #333; $color-pink: #efdff9;
$color-black: #000; $color-white: #fff;

/* 全局配置 */
* {margin: 0;padding: 0;}
a {text-decoration: none;color: #999;}
ul {list-style: none;}

/* 宽高预设样式 */
.width-all{width: 100%;}.height-all{height: 100%;}
.width-vw-all{width: 100vw;}.height-vh-all{height: 100vh;}
.wdith-half{width: 50%;}.height-half{height: 50%;}
.width-vw-half{width: 50vw;}.height-vh-half{height: 50vh;}

/* 布局样式 */
.flex{ display: flex;}
.flex-warp{flex-wrap: wrap;}
.flex-direction-column{flex-direction: column;}
.flex-start{justify-content: flex-start;}
.flex-center{justify-content: center;}
.flex-end{justify-content: flex-end;}
.space-between{justify-content: space-between;}
.space-around{justify-content: space-around;}
.space-evenly{justify-content: space-evenly;}
.block{display: block;}.inline{display: inline;}.inline-block{display: inline-block;}
.overflow-hidden{overflow: hidden;}.overflow-y-auto{overflow-y: auto;}.overflow-x-auto{overflow-x: auto;}
.border-box{ box-sizing: border-box; }

/* 定位样式 */
.absolute{position: absolute;}.relative{position: relative}.fixed{position: fixed;}
.left-0{left: 0;}.top-0{top: 0;}.right-0{right: 0;}.bottom-0{bottom: 0;}

/* 内边距样式 */
.padding-top-s{ padding-top: $s; }.padding-top-xs{ padding-top: $xs; }
.padding-top-m{ padding-top: $m; }.padding-top-sm{ padding-top: $sm; }
.padding-top-l{ padding-top: $l; }.padding-top-sl{ padding-top: $sl; }
.padding-top-ml{ padding-top: $ml; }.padding-top-xl{ padding-top: $xl; }
.padding-top-sd{ padding-top: $sd; }.padding-top-md{ padding-top: $md; }
.padding-bottom-s{ padding-bottom: $s; }.padding-bottom-xs{ padding-bottom: $xs; }
.padding-bottom-m{ padding-bottom: $m; }.padding-bottom-sm{ padding-bottom: $sm; }
.padding-bottom-l{ padding-bottom: $l; }.padding-bottom-sl{ padding-bottom: $sl; }
.padding-bottom-ml{ padding-bottom: $ml; }.padding-bottom-xl{ padding-bottom: $xl; }
.padding-bottom-sd{ padding-bottom: $sd; }.padding-bottom-md{ padding-bottom: $md; }
.padding-left-s{ padding-left: $s; }.padding-left-xs{ padding-left: $xs; }
.padding-left-m{ padding-left: $m; }.padding-left-sm{ padding-left: $sm; }
.padding-left-l{ padding-left: $l; }.padding-left-sl{ padding-left: $sl; }
.padding-left-ml{ padding-left: $ml; }.padding-left-xl{ padding-left: $xl; }
.padding-left-sd{ padding-left: $sd; }.padding-left-md{ padding-left: $md; }
.padding-right-s{ padding-right: $s; }.padding-right-xs{ padding-right: $xs; }
.padding-right-m{ padding-right: $m; }.padding-right-sm{ padding-right: $sm; }
.padding-right-l{ padding-right: $l; }.padding-right-sl{ padding-right: $sl; }
.padding-right-ml{ padding-right: $ml; }.padding-right-xl{ padding-right: $xl; }
.padding-right-sd{ padding-right: $sd; }.padding-right-md{ padding-right: $md; }
.padding-top-xs-i{ padding-top: $xs!important; }
.padding-md{padding:$md;}.padding-sm{padding:$sm;}.padding-xs{padding:$xs;}

/* 外边距样式 */
.margin-top-s{ margin-top: $s; }.margin-top-xs{ margin-top: $xs; }
.margin-top-m{ margin-top: $m; }.margin-top-sm{ margin-top: $sm; }
.margin-top-l{ margin-top: $l; }.margin-top-sl{ margin-top: $sl; }
.margin-top-ml{ margin-top: $ml; }.margin-top-xl{ margin-top: $xl; }
.margin-top-sd{ margin-top: $sd; }.margin-top-md{ margin-top: $md; }
.margin-bottom-s{ margin-bottom: $s; }.margin-bottom-xs{ margin-bottom: $xs; }
.margin-bottom-m{ margin-bottom: $m; }.margin-bottom-sm{ margin-bottom: $sm; }
.margin-bottom-l{ margin-bottom: $l; }.margin-bottom-sl{ margin-bottom: $sl; }
.margin-bottom-ml{ margin-bottom: $ml; }.margin-bottom-xl{ margin-bottom: $xl; }
.margin-bottom-sd{ margin-bottom: $sd; }.margin-bottom-md{ margin-bottom: $md; }
.margin-left-s{ margin-left: $s; }.margin-left-xs{ margin-left: $xs; }
.margin-left-m{ margin-left: $m; }.margin-left-sm{ margin-left: $sm; }
.margin-left-l{ margin-left: $l; }.margin-left-sl{ margin-left: $sl; }
.margin-left-ml{ margin-left: $ml; }.margin-left-xl{ margin-left: $xl; }
.margin-left-sd{ margin-left: $sd; }.margin-left-md{ margin-left: $md; }
.margin-right-s{ margin-right: $s; }.margin-right-xs{ margin-right: $xs; }
.margin-right-m{ margin-right: $m; }.margin-right-sm{ margin-right: $sm; }
.margin-right-l{ margin-right: $l; }.margin-right-sl{ margin-right: $sl; }
.margin-right-ml{ margin-right: $ml; }.margin-right-xl{ margin-right: $xl; }
.margin-right-sd{ margin-right: $sd; }.margin-right-md{ margin-right: $md; }
.margin-top-md-i{ margin-top: $md!important; }
.margin-right-md-i{ margin-right: $md!important; }
.margin-bottom-md-i{ margin-bottom: $md!important; }
.margin-left-md-i{ margin-left: $md!important; }

/* 文本颜色 */
.text-default{color: $color-default}.text-info{color: $color-info}
.text-error{color: $color-error}.text-warning{color: $color-warning}
.text-success{color: $color-success}.text-gray{color: $color-gray}
.text-disabled{color: $color-disabled}.text-pink{color: $color-pink}
.text-black{color: $color-disabled}.text-pink{color: $color-pink}
.text-tips{color: #f2f2f2;}

/* 背景颜色 */
.bgcolor-default{background-color: $color-default;}.bgcolor-info{background-color: $color-info;}
.bgcolor-error{background-color: $color-error;}.bgcolor-warning{background-color: $color-warning;}
.bgcolor-success{background-color: $color-success;}.bgcolor-gray{background-color: $color-gray;}
.bgcolor-disabled{background-color: $color-disabled;}.bgcolor-pink{background-color: $color-pink;}
.bgcolor-tips{background-color: #f2f2f2;}
/* 边框样式 */
.border-sm{ border: 1px solid #eee; }
.border-bottom-com{ border-bottom: 2px solid #eee; }
.border-radius-xl{ border-radius: 1px; }.border-radius-sm{ border-radius: 3px; }.border-radius-md{ border-radius: 5px; }

/* 文本+文本对齐方式 */
.text-center{text-align: center;}.text-right{text-align: right;}
.text-left{text-align: left;}.text-justify{text-align: justify;}
.font-bold{ font-weight: 700; }
.text-hidden{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } // 超出隐藏省略号
.word-spacing01{letter-spacing: 0.1rem;} // 文字间距
.font-xs{font-size: 12px;}.font-sm{font-size: 14px;}.font-base{ font-size: 16px; }
.font-md{ font-size: 18px; }.font-lg{ font-size: 20px; }.font-lgx{ font-size: 24px; } // 准备废弃版本

/* 内容手势 */
.cursorPointer{ cursor: pointer; }

/* 透明度 */
.opacity02{opacity: 0.2;}.opacity05{opacity: 0.5;}.opacity08{opacity: 0.8;}

/* 过渡样式 */
.transition200{transition: 200ms;}.transition300{transition: 300ms;}
.transition500{transition: 500ms;}.transition1000{transition: 1000ms;}
.rotate0{transform:rotate(0deg);}
.rotate180{transform:rotate(180deg);}.rotateF180{transform:rotate(-180deg);}
.rotate90{transform:rotate(90deg);}.rotateF90{transform:rotate(-90deg);}

/* 版本定制-自定义样式 */
.tabel_page_height{ height: calc( 100vh - 150px ); } // 数据表格全屏高度样式
.table_label_td{ background-color: #fafafc!important; width: 20%; } // 详情表格中的label单元格样式
.label_word{ font-size: 16px;font-weight: 700;letter-spacing: 0.1rem;color: #111;margin: 8px 0; } // 弹窗级标题
.label_drawer{ font-size: 18px;font-weight: 700; }
.label_page{ // 页面级标题
    margin-bottom: 10px;
    h1{font-size: 16px;letter-spacing: 0.1rem;font-weight: 700;color: #666;height: 22px;line-height: 25px;}
    .helpIcon{font-size: 16px;margin-left: 6px;color: #666;cursor: pointer;}
 }
.desc_drawer{background-color: #f2f2f2;padding: 8px;margin-bottom: 20px;}
.detail_count{ height: 100px;width: 100%;background-color: #eee;border-radius: 5px; }
.detail_count > div{ padding: 20px 0 10px; }
.form_sub_title{ position: absolute;right: 0;top: -30px;z-index: 999;width: 200px;height: 30px;font-size: 13px;
    text-align: right;box-sizing: border-box;padding: 3px 0px;color: #1890ff;cursor: pointer; }

.formItemTitle{margin: 10px 0 15px;padding-bottom: 10px;font-size: 16px;font-weight: 700;border-bottom: 1px solid #eee;color: #333;}
.formItemLable{font-size: 15px;font-weight: 700;}

.page_container{ padding: 15px 18px; box-sizing: border-box; }
.oper_button{ padding: 5px 10px!important; height: 28px!important; line-height: 28px!important; }
.pagination_container{ display: flex; justify-content: flex-end; padding-top: 10px; box-sizing: border-box; }
.linkBtn{ padding: 0 2px!important;height: 26px!important; }

// 业务详情样式表
.detailLabel{margin: 15px 0 10px;font-size: 14px;font-weight: 700;color: #333;}
.tableStyle{ 
    border-spacing: 0px!important;
    border-top: 1px solid #D9D9D9!important;
    border-left: 1px solid #D9D9D9!important;
    word-break:break-all;
    table-layout:fixed;
    td{
        font-size: 14px;
        border-right: 1px solid #D9D9D9!important;
        border-bottom: 1px solid #D9D9D9!important;
        padding: 8px 10px;
        width: 25%;
        overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    }
    .tableLabel{ background-color: #F2F2F2; }
 }
 .el-form--inline .el-form-item{
    margin-right: 0!important;
 }